<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title></title>
    <script src="js/mui.min.js"></script>
    <link href="css/mui.min.css" rel="stylesheet"/>
    <script type="text/javascript" charset="UTF-8">
      	mui.init();
    </script>
</head>
<body>
	<header class="mui-bar mui-bar-nav">
	    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
	    <h1 class="mui-title">um2mil</h1>
	    <a class='mui-pull-right' href="" id="exit"><span class="mui-icon mui-icon-close"></span></a>
	</header>
	<<div class="mui-content">
		<div class="mui-content-padded" >
		<h4>请输入um</h4>
		<input type="number" name="" id="um" value="" />
		<h4>请输入mil</h4>
		<input type="number" name="" id="mil" value="" />
			
		<button id='calculate' class="mui-btn mui-btn-block mui-btn-green" style="margin-top: 20%">转换计算</button>
		<button id='empty' class="mui-btn mui-btn-block mui-btn-danger">清空数据</button>
		<p style="padding-left: 30%;">1mil=25.4um</p>
	
		</div>
	</div>
	<script type="text/javascript">
		var emptyall=document.getElementById('empty').addEventListener('tap',function(){
			document.getElementById('um').value='';
			document.getElementById('mil').value=''
		});
		var cal=document.getElementById('calculate').addEventListener('tap',function(){
			var valueum=document.getElementById('um').value;
			var valuemil=document.getElementById('mil').value;
			if(valuemil.length<1&&valueum.length<1){
				alert('请输入值')
			} else if(valuemil.length<1&&valueum>1){
				var temp=valueum/25.4;
				document.getElementById('mil').value=temp;
			} else if(valueum.length<1&&valuemil.length>1){
				var temp=valuemil*25.4;
				document.getElementById('um').value=temp
			} else if(valuemil.length>1&&valueum>1){
				alert('请至少删掉一项');
			}
		});
		
		var exitwindow=document.getElementById('exit').addEventListener('tap',function(){
			plus.runtime.quit();
		})
	</script>
</body>
</html>